﻿<!doctype html>
<html class="no-js">

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="description" content="">
		<meta name="keywords" content="">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>创建话题</title>
		<!-- Set render engine for 360 browser -->
		<meta name="renderer" content="webkit">
		<!-- No Baidu Siteapp-->
		<meta http-equiv="Cache-Control" content="no-siteapp" />

		<link rel="icon" type="image/png" href="__ROOT__/Public/yx/assets/i/favicon.png">

		<!-- Add to homescreen for Chrome on Android -->
		<meta name="mobile-web-app-capable" content="yes">
		<link rel="icon" sizes="192x192" href="__ROOT__/Public/yx/assets/i/app-icon72x72@2x.png">

		<!-- Add to homescreen for Safari on iOS -->
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="apple-mobile-web-app-title" content="Amaze UI" />
		<link rel="apple-touch-icon-precomposed" href="__ROOT__/Public/yx/assets/i/app-icon72x72@2x.png">

		<!-- Tile icon for Win8 (144x144 + tile color) -->
		<meta name="msapplication-TileImage" content="assets/i/app-icon72x72@2x.png">
		<meta name="msapplication-TileColor" content="#0e90d2">

		<link rel="stylesheet" href="__ROOT__/Public/yx/assets/css/amazeui.css">
		<link rel="stylesheet" href="__ROOT__/Public/yx/assets/css/app.css">
		<link rel="stylesheet" href="__ROOT__/Public/yx/css/record.css" />
		<link rel="stylesheet" href="__ROOT__/Public/yx/css/create_tp_listen_test.css" />
	</head>

	<body style="background-color: #FFFFFF;">
		<!--在这里编写你的代码-->
		<div id="wrapper">
			<div style="line-height: 48px;background: #FFFFFF;width: 100%;text-align: center; border-bottom: 1px solid #D9D9D9;">
				<div style="padding-left: 14px;padding-right: 14px;float: left;" onclick="onback();">
					<span class="am-icon-chevron-left"></span>
				</div>
				<span style="margin-left: -28px;">创建话题</span>
			</div>

			<center>
				<input id="topic_name" type="text" class="am-form-field" placeholder="请输入话题名称" style="width: 90%;margin-top: 20px;">
			</center>
				<div style="margin-left: 20px;margin-top: 20px;">
					<p>图片尺寸要求：640*340</p>
				</div>
			<center>
				<div style="margin: 10px;">
					<img id="image1" src="__ROOT__/Public/yx/img/add_imgs.png" style="width: 100px;height: 100px;display: none;float: left;margin-left: 10px;" />
					<img id="image2" src="__ROOT__/Public/yx/img/add_imgs.png" style="width: 100px;height: 100px;display: none;float: left;margin-left: 8px;" />
					<img id="image3" src="__ROOT__/Public/yx/img/add_imgs.png" style="width: 100px;height: 100px;display: none;float: left;margin-left: 8px;" />
					<img id="openImage" src="__ROOT__/Public/yx/img/add_imgs.png" style="width: 100px;height: 100px;display: inline;float: left;margin-left: 8px;" />
				</div>

				<div class="am-form-group">
					<textarea class="" rows="5" id="topic_detail" placeholder="请输入话题详情" style="width: 90%;margin-top: 20px;"></textarea>
				</div>
				<div id="lz_record" style="width: 100%;line-height: 48px;background-color: #FFFFFF;padding-left: 10px;">
					<span>录制音频</span>

					<div id="aminrecore" class="loader" style="margin-top: 150%;">
						<span class="ly_span"></span>
						<span class="ly_span"></span>
						<span class="ly_span"></span>
						<span class="ly_span"></span>
						<span class="ly_span"></span>
						<span class="ly_span"></span>
						<span class="ly_span"></span>
						<span class="ly_span"></span>
						<span class="ly_span"></span>
						<span class="ly_span"></span>
						<span class="ly_span"></span>
						<span class="ly_span"></span>
						<span class="ly_span"></span>
						<span class="ly_span"></span>
						<span class="ly_span"></span>
					</div>

					<center style="margin-top: 120px;">
						<a type="button" class="am-btn am-btn-default" id="cancelbtn" style="width: 40%;">取消</a>
						<button id="a_openbtn" type="button" class="am-btn am-btn-primary" style="width: 40%;"><span id="openbtn">开始录音</span><span id="timecount" style="color: #FFFFFF;padding-left: 10px;">60</span></button>
					</center>
					<span style="color: #C2C2C2;font-size: 12px;line-height: 10px;">最多录制三段语音，每段语音可录60秒，最后可将三段语音合并。</span>
				</div>
			</center>
			<div id="test_listen1" style="width: 100%;line-height: 50px;background-color: #FFFFFF;padding-left: 10px;margin-top: 1px;display: none;">
				<img class="am-circle img_test1" src="#" width="40" height="40" style="margin-left: 1.2em;" />
				<div class="loading" class="text_load" style="display: inline;margin-left: 20px;">
					<span></span>
					<span></span>
					<span></span>
					<span></span>
					<span></span>
				</div>
				<span id="btn_listen1" style="width: 20%;display: inline;float: right;margin-right: 20px;color: #0071CE;">试听1</span>
			</div>
			<div id="test_listen2" style="width: 100%;line-height: 48px;background-color: #FFFFFF;padding-left: 10px;margin-top: 1px;display: none;">
				<img class="am-circle img_test1" src="#" width="40" height="40" style="margin-left: 1.2em;" />
				<div class="loading" style="display: inline;margin-left: 20px;">
					<span></span>
					<span></span>
					<span></span>
					<span></span>
					<span></span>
				</div>
				<span id="btn_listen2" style="width: 20%;display: inline;float: right;margin-right: 20px;color: #0071CE;">试听2</span>
			</div>
			<div id="test_listen3" style="width: 100%;line-height: 48px;background-color: #FFFFFF;padding-left: 10px;margin-top: 1px;display: none;">
				<img class="am-circle img_test1" src="#" width="40" height="40" style="margin-left: 1.2em;" />
				<div class="loading" style="display: inline;margin-left: 20px;">
					<span></span>
					<span></span>
					<span></span>
					<span></span>
					<span></span>
				</div>
				<span id="btn_listen3" style="width: 20%;display: inline;float: right;margin-right: 20px;color: #0071CE;">试听3</span>
			</div>
			<center>
				<div id="test_listen4" style="width: 100%;line-height: 48px;background-color: #FFFFFF;padding-left: 10px;margin-top: 1px;display: none;">
					<span id="btn_listen4" style="width: 20%;display: inline;float: right;margin-right: 20px;color: #0071CE;">合并试听</span>
				</div>
			</center>

			<div id="test_listen5" style="width: 100%;line-height: 44px;background-color: #FFFFFF;padding-left: 10px;margin-top: 1px; display: none;">

			</div>
			<div class="am-modal am-modal-alert" tabindex="-1" id="my-alert">
				<div class="am-modal-dialog">
					<div class="am-modal-bd">
						<span id="alert_ts">最多只能录三段语音</span>
					</div>
					<div class="am-modal-footer">
						<span class="am-modal-btn">确定</span>
					</div>
				</div>
			</div>
			<div class="am-modal am-modal-loading am-modal-no-btn" tabindex="-1" id="my-modal-loading">
				<div class="am-modal-dialog">
					<div class="am-modal-hd"><span id="loading_text">正在合并语音...</span></div>
					<div class="am-modal-bd">
						<span class="am-icon-spinner am-icon-spin"></span>
					</div>
				</div>
			</div>

			<p style="margin-left: 20px;display: none;">是否支付</p>
			<div style="margin-left: 20px;">
				<select data-am-selected id="sel_pay" class="" style="display: inline;width: 30px;margin-left: 10px;">
					<option value="否">免费</option>
					<option value="是">付费</option>
				</select>
				<div id="create_pay" style="line-height: 48px;margin-top: 10px;display: inline;visibility: hidden;">
					<span id="pay_text" style="font-size: 16px;margin-right: 8px;display: none;">付费:</span>
					<div id="pay_text_price" style="display: inline;">
						<input type="text" class="am-form-field" id="create_price" placeholder="请输入价格" style="display: inline;width: 30%;font-size: 16px;">
						<span style="font-size: 14px;">元</span>
					</div>
				</div>
			</div>

			<p style="margin-left: 20px;display: none;">是否加密</p>
			<div style="margin-left: 20px;margin-top: 20px;">
				<div class="am-form-group am-form-select" style="margin-top: -10px;padding-top: 10px;padding-bottom: 10px;">
					<select data-am-selected id="sel_pwd" class="" style="width: 15%;">
						<option value="否">免密</option>
						<option value="是">加密</option>
					</select>
					<input type="text" class="am-form-field" id="create_pwd" placeholder="请输入密码" style="font-size: 16px;width: 40%;display: inline;visibility: hidden;">
				</div>
			</div>

			<p style="margin-left: 20px;display: none;">话题类别</p>
			<div class="am-form-group am-form-select" style="margin-top: -10px;background-color: #FFFFFF;padding-top: 10px;padding-bottom: 10px;margin-left: 20px;">
				<select data-am-selected id="sel_type" class="" style="width: 70%;margin-left: 10px;">
					<option value="情感">情感</option>
					<option value="健康">健康</option>
					<option value="人文">人文</option>
					<option value="职场">职场</option>
					<option value="生活">生活</option>
					<option value="亲子">亲子</option>
					<option value="教育">教育</option>
					<option value="商业">商业</option>
				</select>
			</div>
			<center>
				<button id="post_create_topic" type="button" class="am-btn am-btn-secondary am-round" style="width: 90%;margin-top: 20px;margin-bottom: 50px;">提交</button>
			</center>

			<p id="data_json" style="display: none;">fanhui:</p>
			<p id="picture" style="display: none;">fanhui:</p>
			<p id="audio" style="display: none;">fanhui:</p>

		</div>

		<!--[if (gte IE 9)|!(IE)]><!-->
		<script src="__ROOT__/Public/yx/assets/js/jquery.min.js"></script>
		<!--<![endif]-->
		<!--[if lte IE 8 ]>
<script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
<script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
<script src="assets/js/amazeui.ie8polyfill.min.js"></script>
<![endif]-->
		<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
		<script src="__ROOT__/Public/yx/assets/js/amazeui.js"></script>
		<script type="text/javascript" src="__ROOT__/Public/yx/js/back.js"></script>
		<script type="text/javascript" src="__ROOT__/Public/yx/js/wx_config_create_topic.js"></script>
	</body>

</html>